<template>
  <view class="container">
    <view class="container_box">
      <view class="row border-bottom">
        <view class="label">申请日期</view>
        <view class="ipt" style="text-align: right">
          {{ levelDetail.busDate }}
        </view>
      </view>
      <view class="row border-bottom">
        <view class="label">请假开始时间</view>
        <view class="ipt" style="text-align: right">
          {{ levelDetail.beginTime }}
        </view>
      </view>
      <view class="border-bottom row">
        <view class="label">请假结束时间</view>
        <view class="ipt" style="text-align: right">
          {{ levelDetail.endTime }}
        </view>
      </view>
      <view class="row">
        <view class="label flex">请假类型</view>
        <view> {{ typeList[levelDetail.type - 1].name }}</view>
      </view>
    </view>
    <view class="container_box">
      <view>请假原因</view>
      <view class="ipt">
        {{ levelDetail.reason }}
      </view>
    </view>
    <ratifyUser :taskApprove="levelDetail" :BZ="BZName"></ratifyUser>

    <view class="bottom" v-if="showBtn">
      <button class="btn back" @click="no">驳回</button>
      <button class="btn" @click="yes">提交</button>
    </view>

    <uni-popup class="popup" ref="popup" type="bottom" border-radius="10px 10px 0 0" background-color="#fff">
      <view class="title">请选择上级总经理</view>

      <view class="item" v-for="(item, index) in userList" :key="index" @click="selectItem(item)">{{ item.name }}</view>
    </uni-popup>
  </view>
</template>

<script>
import { queryOne } from '@/service/api/askForLeave'
import { getUserInfo } from '@/service/auth'
import { handleApprove } from '@/service/api/common_down'
import ratifyUser from '@/components/ratifyUser'
import { getSysUserList } from '@/service/api/logistics'

export default {
  components: {
    ratifyUser,
  },

  data() {
    return {
      form: {
        zgId: '',
      },
      deptList: [],
      userList: [],
      typeList: [
        { id: 1, name: '事假' },
        { id: 2, name: '公出' },
        { id: 3, name: '年假' },
        { id: 4, name: '病假' },
        { id: 5, name: '调休假' },
        { id: 6, name: '婚假' },
        { id: 7, name: '产假' },
        { id: 8, name: '陪产假' },
        { id: 9, name: '其他' },
      ],
      type: '',
      zgName: '',
      user: {},
      showApprover: false,
      itemDetail: {},
      levelDetail: {},
      showBtn: false,
      showPopup: true,
      BZName: '', //总经理,
      params: {
        flowId: '',
        sourceId: '',
        sourceType: '',
        operationType: '',
        nextUserId: '',
      },
    }
  },
  onLoad(option) {
    this.user = getUserInfo()
    this.itemDetail = JSON.parse(option.item)
    this.getLeaveDetail()
  },
  created() {},
  methods: {
    selectItem(item) {
      this.params.nextUserId = item.id

      this.BZName = item.name
      this.$refs.popup.close()
    },
    getLeaveDetail() {
      queryOne({ id: this.itemDetail.sourceId })
        .then(res => {
          console.log('res=' + res)
          this.levelDetail = res.data
          if (this.levelDetail.currentNodeUserId === this.user.userId && this.levelDetail.lsStatus !== 2) {
            //判断当前节点id是否为登录人id
            this.showBtn = true
          }
        })
        .catch(err => {
          uni.showToast({
            title: err.msg,
            icon: 'none',
          })
        })
    },

    getUserList() {
      //部门负责人审核通过后，需要选择上级总经理，没有上级 提示,在后台加一个
      this.uniShowLoading()
      getSysUserList({ postName: '总经理' })
        .then(res => {
          this.uniHideLoading()

          this.userList = res.content

          if (this.userList.length == 0) {
            uni.showModal({
              title: '提示',
              content: '无总经理，请添加总经理',
              showCancel: false,
              success: function (res) {
                if (res.confirm) {
                  console.log('用户点击确定')
                  uni.navigateBack({
                    delta: 1,
                  })
                } else if (res.cancel) {
                  console.log('用户点击取消')
                }
              },
            })
          } else if (this.userList.length == 1) {
            this.BZName = this.userList[0].name
            this.params.nextUserId = this.userList[0].id
          } else {
            this.$refs.popup.open('bottom')
          }
        })
        .catch(err => {
          uni.showToast({ icon: 'error', title: err.msg })
        })
    },
    yes() {
      //
      //部分负责人审核的时候，如果有多个总经理要选择总经理，提交审核 nextUserId
      if (this.itemDetail.currentNodeName === 'BZ' && !this.params.nextUserId) {
        this.getUserList()
        return
      }

      this.params.flowId = this.itemDetail.id
      this.params.sourceId = this.itemDetail.sourceId
      this.params.sourceType = this.itemDetail.sourceType
      this.params.operationType = '2'
      uni.showLoading({
        title: '处理中',
      })
      handleApprove(this.params)
        .then(res => {
          uni.hideLoading()
          if (res.status === 200) {
            uni.$emit('refreshData', { refresh: true })
            uni.navigateBack({
              delta: 1,
            })
          } else {
            uni.showToast({
              title: res.msg,
              icon: 'none',
            })
          }
        })
        .catch(err => {
          uni.hideLoading()
          uni.showToast({
            title: err.msg,
            icon: 'none',
          })
        })
    },
    no() {
      uni.showLoading({
        title: '处理中',
      })

      this.params.flowId = this.itemDetail.id
      this.params.sourceId = this.itemDetail.sourceId
      this.params.sourceType = this.itemDetail.sourceType
      this.params.operationType = '3'

      handleApprove(this.params)
        .then(res => {
          uni.hideLoading()
          if (res.status === 200) {
            uni.$emit('refreshData', { refresh: true })
            uni.navigateBack({
              delta: 1,
            })
          } else {
            uni.showToast({
              title: res.msg,
              icon: 'none',
            })
          }
        })
        .catch(err => {
          uni.hideLoading()
          uni.showToast({
            title: err.msg,
            icon: 'none',
          })
        })
    },
  },
}
</script>

<style lang="scss" scoped>
.container {
  background-color: #f4f5f9;
  padding: 20rpx;

  height: 100vh;
  &_box {
    margin-top: 20rpx;
    padding: 20rpx;
    background-color: white;
    border-radius: 10rpx;
    .row {
      display: flex;
      justify-content: space-between;
      height: 80rpx;
      line-height: 80rpx;
    }
    .border-bottom {
      border-bottom: 1rpx solid #f1f1f1;
    }
  }
  .bottom {
    display: flex;
    align-items: center;
    position: absolute;
    height: 150rpx;
    bottom: 0;
    background-color: white;
    left: 0;
    right: 0;
    .btn {
      background-color: #2f6fef;
      flex: 1;
      height: 80rpx;
      line-height: 80rpx;
      color: white;
      border-radius: 50rpx;
      margin-left: 20rpx;
      margin-right: 20rpx;
    }
    .back {
      background-color: #f05555;
    }
  }
  .popup {
    padding-top: 20rpx;
    padding-bottom: 40rpx;
    background-color: white;
    border-radius: 10rpx;
    .title {
      height: 80rpx;
      line-height: 80rpx;
      margin-left: 20rpx;
      text-align: center;
    }
    .item {
      height: 60rpx;
      line-height: 60rpx;
      margin-left: 20rpx;
      text-align: center;
    }
  }
}
.row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  .right-icon {
    width: 15rpx;
    image {
      width: 100%;
    }
  }
}
</style>
